<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!--jquery库-->
    <script src="js/jquery.min.js"></script>
    <!--bootstrap库-->
    <link href="css/bootstrap.min.css" rel="stylesheet" />
    <script src="js/bootstrap/bootstrap.min.js"></script>
    <!--[if lt IE 9]>
    <script src="js/bootstrap/html5shiv.min.js"></script>
    <script src="js/bootstrap/respond.min.js"></script>
    <![endif]-->
    <!--font-awesome字体库-->
    <link href="css/font-awesome.min.css" rel="stylesheet" />
    <!--页面加载进度条-->
    <link href="css/pace/dataurl.css" rel="stylesheet" />
    <script src="js/pace/pace.min.js"></script>
    <!--jquery.hammer手势插件-->
    <script src="js/jquery.hammer/hammer.min.js"></script>
    <script src="js/jquery.hammer/jquery.hammer.js"></script>
    <!--平滑滚动到顶部库-->
    <script src="js/jquery.scrolltopcontrol/scrolltopcontrol.js" type="text/javascript"></script>
    <!--主要写的jquery拓展方法-->
    <script src="js/jquery.extend.js" type="text/javascript"></script>
    <!--主要写的css代码-->
    <link href="css/default.css" rel="stylesheet" type="text/css" />
    <!--主要写的js代码-->
    <script src="js/default.js" type="text/javascript"></script>

    <!-- artTemplate 模板引擎 -->
    <script src="js/template-web.js" type="text/javascript"></script>

    <title>妇科检查登记表</title>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        html {
            height: 100%;
        }

        body {
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-size: 14px;
            line-height: 1.42857143;
            color: #333;
            background: #fff;
        }

        .field-row {
            margin: 4px;
        }

        .field-row>.field-item {
            display: inline-block;
            white-space: nowrap;
            margin-left: 10px;
        }

        .field-row>.field-item select {
            display: inline-block;
            white-space: nowrap;
            margin: 0;
            padding: 0;
            border-width: 1px;
            border-style: solid;
            overflow: hidden;
            vertical-align: middle;
            border-color: #AED0EA;
            background-color: #ffffff;
            min-width: 180px;
        }


        .field-row>.field-item>div.value {
            display: inline-block;
        }

        .field-row>.field-item>div.value>input {
            display: inline-block;
            width: 80px;
        }

        input {
            border-top: 0;
            border-left: 0;
            border-right: 0;
            border-bottom: 1px black solid;
            outline: none;
            height: 20px;
            line-height: 20px;
        }

        .head {
            padding-left: 10px;
            height: 28px;
            line-height: 28px;
            background: rgb(23, 134, 184);
            font-size: 10.5pt;
            color: #FFF;
        }

        .box-wrapper {
            width: 1000px;
            margin: 0 auto;
            overflow-x: hidden;
        }

        span.require {
            color: #f00;
        }

        .box {
            border: 1px solid #000;
        }

        input[type="checkbox"],
        input[type="radio"] {
            height: 20px;
            line-height: 20px;
            display: inline-block;
            margin: 6px 2px;
            vertical-align: bottom;
        }

        #otherDiseaseHistory {
            display: inline-block;
            width: 130px;
        }

        .coupon-box {
            height: 120px;
            text-align: center;
            line-height: 120px;
            border: 1px dashed #2e85b8;
            font-size: 24px;
            color: #cecece;
            margin: 30px 0 10px 0;
            cursor: pointer;
            background: #fff;
        }

        .coupon-item {
            width: 80%;
            box-shadow: 2px 2px 5px #f2f2f2, -2px -2px 5px #f2f2f2;
            border-bottom: 1px solid #eee;
            display: flex;
            margin: 10px auto;
            flex-direction: row;
        }

        .coupon-item .btn {
            display: block;
            margin: 10px;
            width: 60px;
            padding: 0;
            height: 28px;
            line-height: 28px;
            text-align: center;
            background: #45b4f5;
            color: #fff;
            /* outline: none; */
            border-color: transparent;
        }

        .coupon-item .content-wrapper {
            flex: 1;
            padding: 10px;
            line-height: 24px;
        }

        .coupon-item .content-wrapper .name {
            font-size: 14px;
            font-weight: 400;
            color: rgba(0, 0, 0, 0.85);
        }

        .coupon-item .content-wrapper .desc {
            font-size: 12px;
            margin-top: 4px;
            color: rgba(0, 0, 0, 0.55);
        }

        .search-box input {
            display: inline-block;
            flex: 1;
            height: 33px;
            line-height: 33px;
            padding-left: 6px;
            /* border-color: transparent; */
            outline: none;
            box-shadow: none;
            /* border: 0; */
            border: 1px solid #7bcdf8;
        }

        .search-box button {
            width: 80px;
            background: #7bcdf8;
            outline: none;
            border: 1px solid #7bcdf8;
            color: #fff;
        }

        .empty-coupon {
            text-align: center;
            line-height: 42px;
            height: 42px;
            font-size: 18px;
            color: rgba(0, 0, 0, 0.45);
        }

        .no-coupon {
            height: 33px;
            line-height: 33px;
            text-align: center;
            margin: 10px 0;
            border: 1px dashed #7bcdf8;
            cursor: pointer;
        }
    </style>
</head>

<body>
<div class="box-wrapper" style="margin-top: 100px;">
    <div class="box">
        <div class="head">妇科检查</div>
        <div class="field-row">
            <div class="field-item">
                <label for="personalHistory">外阴：</label>
                <input type="checkbox" name="personalHistory" value="NTD">正常
                <input type="checkbox" name="personalHistory" value="N21">白斑
                <input type="checkbox" name="personalHistory" value="T18">溃疡
                <input type="checkbox" name="personalHistory" value="其他">湿疣
                <input type="checkbox" name="personalHistory" value="其他">疱疹
                <input type="checkbox" name="personalHistory" value="其他">肿物
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
            <div class="field-item">
                <label for="personalHistory">阴道：</label>
                <input type="checkbox" name="personalHistory" value="NTD">正常
                <input type="checkbox" name="personalHistory" value="N21">充血
                <input type="checkbox" name="personalHistory" value="T18">溃疡
                <input type="checkbox" name="personalHistory" value="其他">湿疣
                <input type="checkbox" name="personalHistory" value="其他">疱疹
                <input type="checkbox" name="personalHistory" value="其他">肿物
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
            <div class="field-item">
                <label for="personalHistory">分泌物：</label>
                <input type="checkbox" name="personalHistory" value="NTD">正常
                <input type="checkbox" name="personalHistory" value="N21">异味
                <input type="checkbox" name="personalHistory" value="T18">血性
                <input type="checkbox" name="personalHistory" value="其他">浓性
                <input type="checkbox" name="personalHistory" value="其他">泡沫样
                <input type="checkbox" name="personalHistory" value="其他">豆渣样
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
            <div class="field-item">
                <label for="personalHistory">子宫颈：</label>
                <input type="checkbox" name="personalHistory" value="NTD">正常
                <input type="checkbox" name="personalHistory" value="N21">触血
                <input type="checkbox" name="personalHistory" value="T18">息肉
                <input type="checkbox" name="personalHistory" value="其他">糜烂样
                <input type="checkbox" name="personalHistory" value="其他">菜花样
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
            <div class="field-item">
                <label for="personalHistory">子宫：</label>
                <input type="checkbox" name="personalHistory" value="NTD">正常
                <input type="checkbox" name="personalHistory" value="N21">大小：
                <input type="checkbox" name="personalHistory" value="T18">正常（如孕期）
                <input type="checkbox" name="personalHistory" value="其他">肿物：大小、性状、位置
                <input type="text" id="otherDiseaseHistory">
                <input type="checkbox" name="personalHistory" value="NTD">脱垂
                <input type="checkbox" name="personalHistory" value="NTD">压痛
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
            <div class="field-item">
                <label for="personalHistory">附件（盆腔）：</label>
                <input type="checkbox" name="personalHistory" value="NTD">正常
                <input type="checkbox" name="personalHistory" value="NTD">压痛：
                <input type="radio" name="rule" value="1">左
                <input type="radio" name="rule" value="0">右
                <input type="checkbox" name="personalHistory" value="其他">肿物：大小、性状、位置
                <input type="text" id="otherDiseaseHistory">
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
        </div>
    </div>
    <div class="box">
        <div class="head">分泌物检查</div>
        <div class="field-row">
            <div class="field-item">
                <label for="assistReproduction">清洁度：</label>
                <select name="assistReproduction" id="assistReproduction">
                    <option value="">请选择</option>
                    <option value="1">Ⅰ度</option>
                    <option value="2">Ⅱ度</option>
                    <option value="3">Ⅲ度</option>
                    <option value="4">Ⅳ度</option>
                </select>
            </div>
            <input type="checkbox" name="personalHistory" value="NTD">滴虫
            <input type="checkbox" name="personalHistory" value="N21">假丝酵母菌
            <input type="checkbox" name="personalHistory" value="T18">加德纳菌
            <input type="checkbox" name="personalHistory" value="其他">线索细胞
            <input type="checkbox" name="personalHistory" value="其他">其他
            <input type="text" id="otherDiseaseHistory">
        </div>
    </div>
    <div class="box">
        <div class="head">妇科检查临床诊断</div>
        <div class="field-row">
            <div class="field-item">
                <label for="assistReproduction">诊断：</label>
                <select name="assistReproduction" id="assistReproduction">
                    <option value="">请选择</option>
                    <option value="1">未见异常</option>
                    <option value="2">异常</option>
                </select>
            </div>
            <div class="field-item">
                <label for="assistReproduction">　</label>
                <input type="checkbox" name="personalHistory" value="NTD">外生殖器尖锐湿疣
                <input type="checkbox" name="personalHistory" value="N21">滴虫性阴道炎
                <input type="checkbox" name="personalHistory" value="T18">外阴阴道假丝酵母菌病
                <input type="checkbox" name="personalHistory" value="其他">细菌性阴道病
                <input type="checkbox" name="personalHistory" value="其他">黏液浓性宫颈炎
                <input type="checkbox" name="personalHistory" value="其他">宫颈息肉
                <input type="checkbox" name="personalHistory" value="其他">子宫肌瘤
                <input type="checkbox" name="personalHistory" value="其他">其他
                <input type="text" id="otherDiseaseHistory">
            </div>
        </div>
        <div class="field-row">
            <div class="field-item">
                <label for="doctorName">检查机构：</label>
                <input type="text" id="doctorName">
            </div>
            <div class="field-item">
                <label for="doctorName">检查人员：</label>
                <input type="text" id="doctorName">
            </div>
            <div class="field-item">
                <label for="bloodDate">检查日期：</label>
                <input type="date" id="bloodDate">
            </div>
        </div>
    </div>
    <div style="width:220px; margin: 30px auto;">
        <button onclick="save();" style="width: 120px; height: 33px; border-radius: 2px; border-radius: 4px; background: rgb(23,134,184); color: #fff; outline: none; border-color: transparent;">保存</button>
    </div>
</div>
</body>

</html>